var wxCharts = require('../../utils/wxcharts.js');
const app = getApp()
var lineChart = null;
var that;
Page({
  data: {
    StatusBar: app.globalData.StatusBar,
    CustomBar: app.globalData.CustomBar,
    userInfo: {},
    th: [],
    tb: [],
    pluviograph: [],
    anemograph: [],
    winddirection: [],
    categories: [],
    hasUserInfo: false,
    canIUse: wx.canIUse('button.open-type.getUserInfo'),
    cardCur: 0,
    widwidth: 320,
    widheight: 700,
    swiperList: [{
      id: 3,
      type: 'image',
      url: app.globalData.serverUrl + '/1.jpg'
    }, {
      id: 1,
      type: 'image',
      url: app.globalData.serverUrl + '/2.jpg',
    }, {
      id: 2,
      type: 'image',
      url: app.globalData.serverUrl + '/3.jpg'
    }]
  },
  DotStyle(e) {
    this.setData({
      DotStyle: e.detail.value
    })
  },
  cardSwiper(e) {
    this.setData({
      cardCur: e.detail.current
    })
  },
  videoTap: function (event) {
    wx.navigateTo({
      url: '../video/video'
    })
  },
  createSimulationData: function () {
    var categories = [];
    var data = [];
    for (var i = 0; i < 10; i++) {
      categories.push('2016-' + (i + 1));
      data.push(Math.random() * (20 - 10) + 10);
    }
    // data[4] = null;
    return {
      categories: categories,
      data: data
    }
  },
  onLoad: function () {
    that = this;
    var windowWidth = 320;
    try {
      var res = wx.getSystemInfoSync();
      windowWidth = res.windowWidth;
    } catch (e) {
      console.error('getSystemInfoSync failed!');
    }
    wx.request({
      url: app.globalData.serverUrl + '/sensorDataList',
      method: 'GET',
      dataType: 'json',
      date: {},
      success: function (res) {
        var sensorData = res.data;
        sensorData.forEach(element => {
          that.data.th.push(element.th/10);
          that.data.tb.push(element.tb/10);
          that.data.pluviograph.push(element.pluviograph);
          that.data.anemograph.push(element.anemograph);
          that.data.winddirection.push(element.windDirection/10);
          that.data.categories.push(element.createTime);
        });
        console.log(that.data.winddirection);
        console.log(that.data.pluviograph);
        console.log(that.data.categories);
        // ========= 图形报表  begin ============================
        console.log(11)
        lineChart = new wxCharts({
          canvasId: 'lineCanvas',
          type: 'line',
          dataLabel: true,
          categories: that.data.categories,
          animation: true,
          // background: '#f5f5f5',
          series: [{
            name: '湿度',
            data: that.data.th,
            format: function (val, name) {
              return val+'%';
            }
          }, {
            name: '温度',
            data: that.data.tb,
            format: function (val, name) {
              return val+'℃';
            }
          } ,{
            name: '雨量',
            data: that.data.pluviograph,
            format: function (val, name) {
              return val+'mm';
            }
          }, {
            name: '风速',
            data: that.data.anemograph,
            format: function (val, name) {
              return val+'m/s';
            }
          }],
          xAxis: {
            disableGrid: true,
            axisLabel: {
              interval:0,
              rotate:15
            }
          },
          yAxis: {
            title: '',
            format: function (val) {
              return val;
            },
            min: 0
          },
          width: windowWidth,
          height: 200,
          dataPointShape: true,
          extra: {
            lineStyle: 'curve'
          }
        });
        // ========= 图形报表  end ============================  
      }
    })


  }
})